/* 主题色 */
.theme-color {
  color: #7de9ff;
}
.color-f {
  color: #ffffff;
}
.color-0 {
  color: #000000;
}
.color-ffc4 {
  color: #fe66c4;
}
.color-ff00{
  color:#ff0000;
}
.color-4{
  color: #444444;
}
.color-9 {
  color: #999999;
}
.color-9e {
  color: #9e9e9e;
}
.color-a {
  color: #aaaaaa;
}
.color-45 {
  color: #4540bf;
}
.color-d6 {
  color: #d6d6d6;
}

.color-af47{
  color:#A0F4F7;
}
.color-fa{
  color:#FAFAFA;
}
.color-5c9af6{
  color:#5C9AF6;
}
.color-yellow{
  color: #ffd500;
}
.color-fe50{
  color: #ffe500;
}
.color-04f0{
  color:#04ff00;
}
.color-f0{
  color:#ff0000;
}
.color-c8 {
  color: #c8c8c8;
}
/* 背景色 */
.bg-theme {
  background: #7de9ff;
}
.bg-f {
  background: #ffffff;
}
.bg-f-8 {
  background: rgba(255, 255, 255, 0.8)
}
.bg-32 {
  background: #323232;
}
.bg-yellow {
  background: #ffd500;
}
.bg-ffc4 {
  background: #fe66c4;
}
.bg-5d {
  background: #5d5d5d;
}
.bg-5d-8 {
  background: rgba(93, 93, 93, 0.8);
}
.bg-58 {
  background: #585858;
}
.bg-d3 {
  background: #d3d3d3;
}
.bg-69 {
  background: #696969;
}
.bg-47{
  background:#474747;
}
.bg-af47{
  background: #A0F4F7;
}
.bg-0{
  background: #000;
}
/* text */
.text-c {
  text-align: center;
}
.text-r {
  text-align: right;
}
.text-l {
  text-align: left;
}
/* float */
.float-r {
  float: right;
}

/* text-shadow */
.text-s {
  text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
}
/* 圆角 */
.border-ard{
  border-radius: 0px 10px 10px 0px;
}
.border-r {
  border-radius: 5px;
}
.bd-r-10 {
  border-radius: 10px;
}
.border-lb {
  border-radius: 10px 0px 0px 10px;
}
.border-rt{
  border-radius: 0px 10px 10px 0px;
}
.border-lb-5 {
  border-radius: 5px 0px 0px 5px;
}
.border-rt-5 {
  border-radius: 0px 5px 5px 0px;
}
.bd-r-b {
  border-radius: 0px 0px 5px 5px;
}
.radius-50 {
  border-radius: 50%;
}
/* box-shadow */
.boxS-i-4{
  box-shadow: inset 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
}
.box-4{
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
}
/* border */
.border_b-1 {
  border-bottom: 1px solid #d8d8d8;
}
.border_r-1 {
  border-right: 1px solid #d8d8d8;
}
.bd-b-1 {
  border-bottom: 1px solid #7CB7FF;
}
.border_b_tb_1 {
  border-bottom: 1px solid #d8d8d8;
  border-top: 1px solid #d8d8d8;
}
.border-1 {
  border: 1px solid #A0F4F7;
}
.bd_t-2_d8 {
  border-top: 1px solid #d8d8d8;
}
.bd_t-1_f5 {
  border-top: 1px solid #FFD500;
}
.bd_b-2_d8 {
  border-bottom: 2px solid #d8d8d8;
}
.bd-2_d8 {
  border: 2px solid #d8d8d8;
}
.border-2 {
  border: 2px solid #A0F4F7;
}
.border-3 {
  border: 3px solid #A0F4F7;
}
.border-3-f6c4 {
  border: 3px solid #FE66C4;
}
.border-3-ff{
  border: 3px solid #FFD500;
 }
.border-1-ff{
  border: 1px solid #FFD500;
}
.border-3-7de{
  border: 3px solid #7DE9FF;
}
.border-2-7de{
  border: 2px solid #7DE9FF;
}
.border-5-7de{
  border: 5px solid #7DE9FF;
}
.border-n {
  border:none;
}
/* margin */
.mg-0 {
  margin: 0 auto;
}
.mgt-5 {
  margin: 5px auto 0;
}
.mgb-5 {
  margin: 0 auto 5px;
}
.mgl-5 {
  margin: 0 0 0 5px;
}
.mgr-5 {
  margin: 0 5px 0 0;
}
.mgt-10 {
  margin: 10px auto 0;
}
.mgtb-10 {
  margin: 10px auto;
}
.mgb-10 {
  margin: 0 auto 10px;
}
.mg-20 {
  margin: 20px auto;
}
.mlr-20{
  margin: auto 20px;
}
.mg-2{
  margin: 20px;
}
.mgt-20 {
  margin: 20px auto 0;
}
.mgb-20 {
  margin: 0 auto 20px;
}
.mgtb-20 {
  margin: 20px auto;
}
.mgt-30 {
  margin: 30px auto 0;
}
.mgl-10 {
  margin: 0 0 0 10px;
}
.mgr-10 {
  margin: 0 10px 0 0;
}
.mgl-13 {
  margin: 0 0 0 13px;
}
.mgl-30 {
  margin: 0 0 0 30px;
}
.mgtb-30 {
  margin: 30px 0;
}
.mgl-20 {
  margin: 0 0 0 20px;
}
.mgr-20 {
  margin: 0 20px 0 0;
}
.mgtb-40 {
  margin: 40px auto;
}
.mgt-50 {
  margin: 50px 0 0 0;
}
.mgb-50 {
  margin: 0 0 50px 0;
}
.mglr-50{
  margin:auto 50px
}
.mgt-100 {
  margin: 100px 0 0 0;
}
.bmg_tb10 {
  margin: 10% auto;
}
/* padding */
.pd-5 {
  padding: 5px;
}
.pdtb-5 {
  padding: 5px 0;
}
.pdlr-5 {
  padding: 0 5px;
}
.pd-5-l-10 {
  padding: 5px 0 0 10px;
}
.pd-10 {
  padding: 10px;
}
.pdl-10 {
  padding: 0 0 0 10px;
}
.pdr-10 {
  padding: 0 10px 0 0;
}
.pdlr-10 {
  padding: 0 10px;
}
.pdtb-10 {
  padding: 10px 0;
}
.pd-10-15 {
  padding: 10px 15px;
}
.pd-20-50{
  padding: 20px 50px;
}
.pdtb-20 {
  padding: 20px 0;
}
.pdl-10 {
  padding: 0 0 0 10px;
}
.pdb-10 {
  padding: 0 0 10px 0;
}
.pdl-15 {
  padding: 0 0 0 15px;
}
.pdl-35{
  padding: 0 0 0 35px;
}
.pdtb-30 {
  padding: 30px 0;
}
.pdt-30 {
  padding: 30px 0 0 0;
}
.pdr_10 {
  padding: 0 10% 0 0;
}
.pd-20{
  padding: 20px;
}
.pdlr-20{
  padding: 0 20px;
}
/* font-size */
.font-10 {
  font-size: 10px;
}
.font-12{
  font-size: 12px;
}
.font-14 {
  font-size: 14px;
}
.font-15 {
  font-size: 15px;
}
.font-16 {
  font-size: 15px;
}
.font-18 {
  font-size: 18px;
}
.font-20 {
  font-size: 20px;
}
.font-22 {
  font-size: 22px;
}
.font-24 {
  font-size: 24px;
}
.font-25{
  font-size: 25px;
}
.font-28 {
  font-size: 28px;
}
.font-26 {
  font-size: 26px;
}
.font-30 {
  font-size: 30px;
}
.font-36 {
  font-size: 36px;
}
.font-45 {
  font-size: 45px;
}
.center_a{
  text-align: center;
}
.width_and{
  width: 70px;  
  height: 70px;
  background-color:red;
}
.font_spill{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
/* font-weight */
.fontW-n {
  font-weight: normal;
}
.fontW-b {
  font-weight: bold;
}
.fontW-4 {
  font-weight: 400;
}
.fontW-7 {
  font-weight: 700;
}
.fontW-8 {
  font-weight: 800;
}
.fontW-9 {
  font-weight: 900;
}
/* foontfamily */
.font-f-ib {
  font-family: Inter-Bold;
}
.font-f-iR{
  font-family: Inter-Regular;
}
/* flex布局 */
.flex {
  display: flex;
}
.flex-left-nowrap {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-start;
  align-items: center;
}
.flex-start {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: flex-start;
  justify-content: flex-start;
  align-items: flex-start;
}
.flex-c-start{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-start;
  align-items: center;
}
.print_flex{
  display: flex;
  justify-content: space-around;
}
.flex-n-center {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  align-items: center;
  justify-content: center;
}
.flex-s-between {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
}
.flex-s-between-start {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: flex-start;
}
.flex-s-around {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-around;
  align-items: center;
}
.flex-r-ss {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: flex-start;
  justify-content: space-between;
  align-items: flex-start;
}
.flex-r-end {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-end;
  align-items: center;
}
.flex-r-base {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: baseline;
}
/* row wamp */
.flex-w-start {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: flex-start;
  align-items: center;
}
.flex-w-s-between {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
}
.flex_w_start {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: flex-start;
  align-items: center;
}
.flex_w_start_s {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: flex-start;
  align-items: flex-start;
}
.flex-dc-s-between {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
}
.flex-c-fs-between {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: flex-start;
}
.flex-dc-s-al{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  align-content: center;
  flex-wrap: nowrap;
}
.flex_c_center {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: center;
  align-items: center;
}
.flex-c_s{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: space-between;
  justify-content: space-between;
  align-items: stretch;
}
.flex-c_sa{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: space-between;
  justify-content: space-around;
  align-items: stretch;
}
.flex-c-ss{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  align-content: center;
  justify-content: space-between;
}
.flex-0_5 {
 flex: 0.5;
}
.flex-1_5 {
  flex: 1.5;
}
.flex-1 {
  flex: 1;
}
.flex-2 {
  flex: 2;
}
.flex-3 {
  flex: 3;
}
.flex-4 {
  flex: 4;
}
/* height */
.h-33 {
  height: 33px;
  line-height: 33px;
}
.h-37 {
  height: 37px;
  line-height: 37px;
}
.h-40 {
  line-height: 40px;
}
.h-3 {
  line-height: 33px;
}
.max_w-1200 {
  max-width: 1200px;
}
.display-n{
  display: none;
}
.opacity-0{
  opacity: 0;
}
.center{
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
}
.ov_h {
  overflow: hidden;
}
.ov_y {
  overflow-y: auto;
}